<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>MyPetStore</title>
    <link rel="Stylesheet" href="../css/jpetstore.css" type="text/css" media="screen"/>
</head>
<body>
<div th:replace="common/top">
</div>
<script type="text/javascript">
    function sendCode(){
        var phone = $("#phone").val();
        $.ajax({
            type: 'GET',
            url: '/account/code',
            data: {phone : phone},
            dataType: 'json',
            success: function(data) {
                if(data){
                    timer(60);
                }else{
                    layer.msg("获取验证码失败");
                }
            },
            error: function(data) {
                layer.msg('连接超时！');
            },
        });
    }
    //倒计时
    function timer(wait) {
        if(wait == 0){
            $("#sendBtn").val("获取验证码");
            $("#sendBtn").removeAttr("disabled");
            wait = 60;
        }else{
            $("#sendBtn").attr("disabled","true");
            $("#sendBtn").val(wait + "秒后重发");
            wait--;
            setTimeout(function() {timer(wait)}, 1000);
        }
    }
</script>
<div id="Content">
    <div id="BackLink">
        <a href="/catalog/main">Return to Main Menu</a>
    </div>
    <div id="Catalog">
        <form action="" method="post" id="sigon">
            <p>Please enter your username and password.</p>
            <p>
                Username:<input id="username" type="text" name="username"/><br />
                <span id="usernameTips"></span><br />
<!--                <script type="text/javascript" th:inline="javascript" th:src="@{../js/sigon.js}"></script><br />-->
                Password:<input id="password" type="password" name="password" /><br />
                <span id="passwordTips"></span><br />
<!--                <script type="text/javascript" src="../js/sigon.js"></script><br />-->
                PhoneNum:<input id="phone" type="text" name="phone"><br/>
                <span id="phoneTips"></span><br/>
                VerificationCode:<input id="vCode" type="text" name="vCode" size="5" maxlength="6"/>
                <input type="button" value="发送短信" id="sendBtn" onclick="sendCode()"><br/>
<!--                <a href="/account/signonForm"><img border="0" src="/account/verificationCode" name="checkcode"></a>-->
<!--                <span id="vCodeTips"></span>-->
<!--                <script type="text/javascript" src="../js/sigon.js"></script><br />-->
            </p>
            <input id="putsignon" type="button" name="signon" value="Login" />
            <!--/*@thymesVar id="account" type="org.csu.mypetstore.domain.."*/-->
<!--            <input id="in" type="text" th:text="${account}">-->
<!--            <div id="signonTips" ></div>-->
<!--               <input id="putsignon" type="submit" value="Login">-->
<!--            <script type="text/javascript" src="../js/sigon.js"></script>-->
        </form>
        Need a user name and password?
        <!--newAccountForm-->
        <a th:href="@{'/account/newAccountForm'}">Register Now!</a>
        <script th:src="@{../js/jquery-3.5.1.min.js}"></script>
        <script th:src="@{../js/sigon.js}"></script>
    </div>
</div>
<script th:src="@{../js/jquery-3.5.1.min.js}"></script>
<script th:src="@{../js/sigon.js}"></script>
<div th:replace="common/bottom">
</div>
</body>
</html>